<template>
  <div class="main-div">
    <div class="main-button-div">
      <el-button type="primary" @click="search">查询</el-button>
    </div>
    <div class="main-table-div-no-page">
      <common-page-table
          :data="tableData"
          :columns="columns"
          :show-border="true"
          :show-no="true"
          :loading="tableLoading"
          :show-action="true"
          :show-page="false"
          :action-config="actionConfig"
      >
        <template #action="{row}">
          <el-button type="primary" size="small" round @click="previewFn(row)">预览</el-button>
          <el-button type="primary" size="small" round @click="downloadFn(row)" :loading="downloadLoading">下载
          </el-button>
        </template>
      </common-page-table>
    </div>
  </div>

</template>

<script setup lang="ts">
import {onMounted, ref} from "vue";
import CommonPageTable from "@/components/common/CommonPageTable.vue";
import {RESPONSE_CODE_SUCCESS} from "@/config/common-config.ts";
import {getLogFileListReq} from "@/api/monitoring/log.ts";
import {concatLogUrl, previewFun} from "@/utils/preview.ts";
import {downloadLogFileReq} from "@/api/common/common.ts";
import {errorMessageTip} from "@/utils/tip-utils.ts";


const searchLoading = ref(false)
const search = async () => {
  searchList().then();
}

const searchList = async () => {
  searchLoading.value = true

  const res: any = await getLogFileListReq()
  searchLoading.value = false
  if (res.code === RESPONSE_CODE_SUCCESS) {
    tableData.value = res.data;
  }
  searchLoading.value = false
}

const tableData = ref<any[]>([])
const columns = [
  {prop: 'fileName', label: '文件名称', width: 'auto', fixed: 'left'},
  {prop: 'fileSize', label: '操作时间', width: 'auto'},
  {prop: 'modifyTime', label: '操作用户', width: 'auto'}
]

const tableLoading = ref<boolean>(false)
const actionConfig = {
  prop: 'action',
  label: '操作',
  width: 'auto',
}

const previewFn = (row: any) => {
  previewFun(concatLogUrl(row.fileName))
}

const downloadLoading = ref(false)
const downloadFn = async (row: any) => {
  downloadLoading.value = true

  const params = {
    fileName: row.fileName
  }
  try {
    await downloadLogFileReq(params)
  } catch (e) {
    errorMessageTip((e as Error).message);
  } finally {
    downloadLoading.value = false
  }
}

onMounted(async () => {
  searchList().then()
})

</script>

<style scoped>

</style>